<script setup lang="ts">
import { ref } from "vue";
const theAboutUsVisible = ref(false);
</script>

<template>
  <!--Site Footer One Start-->
  <footer class="site-footer">
    <div class="site-footer__top">
      <div class="container">
        <div class="site-footer__top-inner">
          <div class="row">
            <div
              class="col-xl-4 col-lg-6 col-md-6 wow fadeInUp"
              data-wow-delay="100ms"
            >
              <div class="footer-widget__column footer-widget__about">
                <div class="footer-widget__about-logo">
                  <router-link to="/"
                    ><img
                      src="/images/resources/love-to-travel-logo2.png"
                      alt=""
                  /></router-link>
                </div>
                <p class="footer-widget__about-text">欢迎光临爱旅游！</p>
                <ul class="footer-widget__about-contact list-unstyled">
                  <li>
                    <div class="icon">
                      <i class="fas fa-phone-square-alt"></i>
                    </div>
                    <div class="text">
                      <a href="tel:+92-666-888-0000">+92 666 888 0000</a>
                    </div>
                  </li>
                  <li>
                    <div class="icon">
                      <i class="fas fa-envelope"></i>
                    </div>
                    <div class="text">
                      <a href="javascript:;">lovetotravel@foxmail.com</a>
                    </div>
                  </li>
                </ul>
              </div>
            </div>
            <div
              class="col-xl-2 col-lg-6 col-md-6 wow fadeInUp"
              data-wow-delay="200ms"
            >
              <div
                class="footer-widget__column footer-widget__company clearfix"
              >
                <h3 class="footer-widget__title">公司</h3>
                <ul class="footer-widget__company-list list-unstyled">
                  <li>
                    <a href="javascript:;" 
                      >关于我们</a
                    >
                  </li>
                  <li>
                    <router-link to="/goTravel/city">城市/景区</router-link>
                  </li>
                  <li><router-link to="/readTravel/note">游记</router-link></li>
                  <li>
                    <router-link to="/groupTravel/team">组队</router-link>
                  </li>
                  <li>
                    <router-link to="/buyTravel/product">产品</router-link>
                  </li>
                </ul>
              </div>
            </div>
            <div
              class="col-xl-2 col-lg-6 col-md-6 wow fadeInUp"
              data-wow-delay="300ms"
            >
              <div class="footer-widget__column footer-widget__explore">
                <h3 class="footer-widget__title">探索</h3>
                <ul class="list-unstyled footer-widget__explore-list">
                  <li><a href="javascript:;">账户</a></li>
                  <li><a href="javascript:;">法律</a></li>
                  <li><a href="javascript:;">联系</a></li>
                  <li><a href="javascript:;">程序</a></li>
                  <li><a href="javascript:;">隐私政策</a></li>
                </ul>
              </div>
            </div>
            <div
              class="col-xl-4 col-lg-6 col-md-6 wow fadeInUp"
              data-wow-delay="400ms"
            >
              <div class="footer-widget__column footer-widget__newsletter">
                <h3 class="footer-widget__title">持续关注我们</h3>
                <div class="mc-form__response text-center"></div>
                <!-- /.mc-form__response -->
                <div class="footer-widget__newsletter-bottom">
                  <div class="footer-widget__newsletter-bottom-icon">
                    <i class="fa fa-check"></i>
                  </div>
                  <div class="footer-widget__newsletter-bottom-text">
                    <p>我同意所有条款和政策</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="site-footer__bottom">
      <div class="container">
        <div class="row">
          <div class="col-xl-12">
          </div>
        </div>
      </div>
    </div>
  </footer>
</template>

<style lang="scss" scoped>
.my-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.about-container {
  width: 1500px;
  height: 480px;
}
.team-one__single {
  width: 245px;
  height: 459px;
  // border: 1px #e8604c solid;
  border-radius: 10px;
  padding-bottom: 10px;
  margin-top: 20px;
  box-shadow: 0 2px 27px 6px rgba(0, 0, 0, 0.12);
}
.team-one__img {
  width: 245px;
  height: 300px;
  img {
    width: 100%;
    height: 100%;
  }
}
.team-one__name {
  cursor: pointer;
}
.team-one__title {
  margin-top: 10px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
}
.team-one__content {
  width: 225px;
}
.row-about-container {
  width: 100%;
  height: auto;
  display: flex;
}
// ::v-deep .el-dialog__body {
//   width: 1100px;
//   // height: 600px;
// }
// ::v-deep .el-dialog.is-align-center {
//   // width: 1100px;
//   // height: 600px;
//   margin: 0 !important;
// }
</style>
